<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page import="com.stone.utils.Page"%>
<%@ page import="com.stone.model.ProviderStone"%>
<%@ page import="com.stone.model.Provider"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
Page pageBean = (Page)request.getAttribute("pageBean"); 
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title></title>
    <link rel="shortcut icon" href="images/ico.ico">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="shicai">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> 
	<link href="css/header.css"  rel="stylesheet" type="text/css" charset="utf-8" />
	<link href="css/detail.css"  rel="stylesheet" type="text/css" charset="utf-8" />
	<link rel="stylesheet" href="css/backToTop.css" type="text/css" />
	<link rel="stylesheet" href="css/nav.css" type="text/css" />
	<link rel="shortcut icon" href="images/ico.ico">
	<script src="js/jquery-1.7.1.js"></script>
	<script type="text/javascript" src="js/jwidget_1.0.0-min.js"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
	<style>
		.hd.company{background:none!important;padding:0px;border-bottom:2px solid #D14313;height:25px!important;}
		.bd.company{min-height:180px;}
	</style>
	
	<script type="text/javascript">
		var preClassName = "man_nav_1";
		function list_sub_nav(Id,sortname){
		   if(preClassName != ""){
			  getObject(preClassName).className="bg_image";
		   }
		   if(getObject(Id).className == "bg_image"){
			  getObject(Id).className="bg_image_onclick";
			  preClassName = Id;
		   }
		   
		   getObject("image_zoom").style.display = "none";
		   getObject("container").style.display = "none";
		   if(Id == 'man_nav_1') {
				getObject("image_zoom").style.display = "block";
		   } else {
				getObject("container").style.display = "block";
				loadMap();
		   }
		}
		
		//获取对象属性兼容方法
		 function getObject(objectId) {
			if(document.getElementById && document.getElementById(objectId)) {
			// W3C DOM
			return document.getElementById(objectId);
			} else if (document.all && document.all(objectId)) {
			// MSIE 4 DOM
			return document.all(objectId);
			} else if (document.layers && document.layers[objectId]) {
			// NN 4 DOM.. note: this won't find nested layers
			return document.layers[objectId];
			} else {
			return false;
			}
		}
	</script>
	
	<script type="text/javascript">
	var addressArray, nameArray, sContentArray, GPSArray;
	var myGeo, map;
	
	function loadMap() {
		map = new BMap.Map("container");
		//默认三明市为中心
		map.centerAndZoom(new BMap.Point(118.18267822265625,24.781747337815794), 8);
		map.addControl(new BMap.NavigationControl());//启动鱼骨插件
		map.addControl(new BMap.OverviewMapControl());//启动缩略图
		map.enableScrollWheelZoom();                  // 启用滚轮放大缩小。
		map.enableKeyboard();                         // 启用键盘操作。
		// 创建地址解析器实例
		myGeo = new BMap.Geocoder();
		
		addressArray = new Array();
		nameArray = new Array();
		GPSArray = new Array();
		sContentArray = new Array();
	<%
      	for(int i=0;i<pageBean.getList().size();i++){
			ProviderStone ps = (ProviderStone)pageBean.getList().get(i);
      		Provider provider = ps.getProvider();
	%>	
			addressArray.push("<%=provider.getAddress()%>");
			nameArray.push("<%=provider.getName()%>");
			sContent = "<h4 style='margin:0 0 5px 0;padding:0.2em 0'>"
						+"<%=provider.getName()%>"
						+"</h4>"
						+"<p>地址："
						+"<%=provider.getAddress()%>"
						+"</p>"
						+"<p><a href='provider/getProvider.action?providerId="
						+"<%=provider.getId()%>"
						+"'><font style='color:#008000;'>查看详情>></font></a></p>"
						+"<img style='margin:4px' id='imgDemo' src='upload/provider/"
						+"<%=provider.getPhoto()%>"
						+"' width='120' height='120'/>"
						+"</div>";
			sContentArray.push(sContent);
			GPSArray.push("<%=provider.getLnglat()%>");
	<%
		}
	%>
		resolvePoint(0);
	}

	function resolvePoint(pos) {
		if(pos>=addressArray.length)
			return;
		// 将地址解析结果显示在地图上,并调整地图视野
		if(GPSArray[pos] != "null" && GPSArray[pos]!= "")
		{
			var position = GPSArray[pos].split("，");
			var point = new BMap.Point(position[0],position[1]);
			var marker = new BMap.Marker(point);
			var infoWindow = new BMap.InfoWindow(sContentArray[pos]);  // 创建信息窗口对象
			var label = new BMap.Label(nameArray[pos], {position: point});       //定义一个文字标签
			map.addOverlay(label);
			map.addOverlay(marker);
			marker.addEventListener("click", function(){          
		   		this.openInfoWindow(infoWindow);
		   		//图片加载完毕重绘infowindow
		  		document.getElementById('imgDemo').onload = function (){infoWindow.redraw();}
			});			
	  		resolvePoint(pos+1);
		}
		else if(addressArray[pos] != "null" && addressArray[pos] != "")
		{
			myGeo.getPoint(addressArray[pos], function(point){
			  		if (point) {
						var marker = new BMap.Marker(point);
						var infoWindow = new BMap.InfoWindow(sContentArray[pos]);  // 创建信息窗口对象
						var label = new BMap.Label(nameArray[pos], {position: point});       //定义一个文字标签
						map.addOverlay(label);
						map.addOverlay(marker);
			
			
						marker.addEventListener("click", function(){          
			   			this.openInfoWindow(infoWindow);
			   			//图片加载完毕重绘infowindow
			  			 document.getElementById('imgDemo').onload = function (){infoWindow.redraw();}
						});			
		  			}
		  			resolvePoint(pos+1);
			}, "福建");	
		}
		else
			return;
	}

	</script>
  </head>
  <body>

	<jsp:include page="pages/header.jsp"></jsp:include>
	<div class="grid-m div" style="display:block;margin:auto;">
	<div class="left-box">
		<div id="nav">
			<ul>
				<li id="man_nav_1" onclick="list_sub_nav(id,'石材照片')"  class="bg_image_onclick">石材照片</li>
				<li id="man_nav_2" onclick="list_sub_nav(id,'地图分布')"  class="bg_image">地图分布</li>
		   </ul>
		</div>
		<div id="image_zoom" style="display:block">
			<div id="slider" class="slider">
				<ul id="slider_panel" class="slider_panel">
					<s:iterator value="photos" var="photo">
						<li><img src="upload/stone/560/<s:property value='url'/>"  /></li>
					</s:iterator>
				</ul>
				<ul id="slider_nav" class="slider_nav">
				   <s:iterator value="photos" var="photo">
						<li><img src="upload/stone/70/<s:property value='url'/>"  /></li>
					</s:iterator>
				</ul>
				<div class="slider_opacity"></div>
			</div>
		</div>
		<div style="width:564px;height:580px;border:1px solid gray; display:none" id="container"></div>
    </div>
   
    <div class="right-box">
    	<div class="hd">
            <span class="name bla">供应公司名称</span>
            <span class="icon"></span>
            <span class="zhi bla">质</span>
            <span class="liang bla">量</span>
            <span class="price bla" style="height:20px;overflow:hidden;position:relative;">荒料(元/M<sup>2</sup>)</span>
            <span class="price bla" style="height:20px;overflow:hidden;position:relative;">大板(元/M<sup>2</sup>)</span>
        </div>
        <div class="bd">
            <%
      		for(int i=0;i<pageBean.getList().size();i++){
      			ProviderStone ps = (ProviderStone)pageBean.getList().get(i);
      			Provider provider = ps.getProvider();
      			if(provider != null){
      			if(i==0){%>
      				<ul>
      			<%}
      			if(i==5){%>
  				<!--</ul><div class="clear2"></div><ul> -->
  				<%}
      			if(i==10){%>
  				<!--</ul><div class="clear2"></div><ul> -->
  				<%}
      			if(i==15){%>
  				<!-- </ul><div class="clear2"></div><ul> -->
  				<%}
      			if(i<5){
      			%>  	
                <li>
                	<span class="xuhao"><%=i+1 %></span>
                    <span class="name"><a href="provider/getProvider.action?providerId=<%=ps.getProvider().getId()%>"><font style="width: 135px;overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;" class="red blod"><%=ps.getProvider().getName() %></font></a> <!--  <i class="hot"></i>--></span>
                    <span class="zhi bla"><%if(ps.getQuality()==null||ps.getQuality()==""){%>-<%}else{%><%=ps.getQuality()%><%} %></span>
                    <span class="liang gray"><%if(ps.getQuantity()==null||ps.getQuantity()==""){%>-<%}else{%><%=ps.getQuantity() %><%} %></span>
                    <span class="price red blod"><%if(ps.getRawMinprice()== null &&ps.getRawMaxprice()== null){ %>-<%} else{%><%=ps.getRawMinprice()%>-<%=ps.getRawMaxprice() %><%} %></span>
                    <span class="price red blod"><%if(ps.getSlabMinprice()== null &&ps.getSlabMaxprice()== null){ %>-<%} else{%><%=ps.getSlabMinprice()%>-<%=ps.getSlabMaxprice() %><%} %></span>
                </li>
                <%}else{ %>
                 	<li>
	                	<span class="xuhao xuhao2"><%=i+1 %></span>
	                    <span class="name" style="overflow:hidden;"><a href="provider/getProvider.action?providerId=<%=ps.getProvider().getId()%>"><font style="width:135px ;overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap;" class="bla"><%=ps.getProvider().getName() %></font></a></span>
	                    <span class="zhi bla"><%if(ps.getQuality()==null||ps.getQuality()==""){%>-<%}else{%><%=ps.getQuality()%><%} %></span>
	                    <span class="liang gray"><%if(ps.getQuantity()==null||ps.getQuantity()==""){%>-<%}else{%><%=ps.getQuantity() %><%} %></span>
	                    <span class="price red blod"><%if(ps.getRawMinprice()==null&&ps.getRawMaxprice()==null){ %>-<%} else{%><%=ps.getRawMinprice()%>-<%=ps.getRawMaxprice() %><%} %></span>
	                    <span class="price red blod"><%if(ps.getSlabMinprice()==null&&ps.getSlabMaxprice()==null){ %>-<%} else{%><%=ps.getSlabMinprice()%>-<%=ps.getSlabMaxprice() %><%} %></span>
                	</li>
                
                <%}}}%></ul>
        </div>
    </div>
</div>
<div class="clear" style="_width:960px;overflow:hidden;"></div>
<div class="grid-m" style="padding:5px;">
	<div class="detail">
    	<table>
        	<tbody>
            	<tr height="25">
                	<td width="184"><font>中文名称：</font><font class="blod">${stone.chineseName }</font></td>
                    <td width="214"><font>英文名称：</font><font class="blod">${stone.englishName }</font></td>
                    <td width="174"><font>种类：</font><font>${stone.material }</font></td>
                    <td width="164"><font>颜色：</font><font>${stone.color }</font></td>
                    <td width="184"><font>价位：</font><font>
                    ${stone.minprice }-${stone.maxprice }
                    </font></td>
                </tr>
                <tr height="25">
                	<td><font>纹理：</font><font class="yellow">${stone.venation }</font></td>
                    <td><font>原产地：</font><font>${stone.sourceland }</font></td>
                    <td><font>档次：</font><font class="yellow">${stone.level }</font></td>
                    <td><font>适用于：</font><font class="yellow">${stone.purpose }</font></td>
                </tr>
                <tr height="25">
                	<td><font>抗压强度：</font><font>${stone.stoneCS }</font></td>
                    <td><font>抗折强度：</font><font>${stone.stoneMR }</font></td>
                    <td><font>肖氏硬度：</font><font>${stone.stoneSH }</font></td>
                    <td><font>岩石密度：</font><font>${stone.stoneBD }</font></td>
                    <td><font>吸水率：</font><font>${stone.stoneWA }</font></td>
                </tr>
                <tr height="25">
                	<td colspan="4"><font>成功案例：</font><font class="yellow">
                    <s:if test="stone.successfulCase == 1">
                    	暂无
                    </s:if>
                    <s:else>${stone.successfulCase }</s:else>
                    </font></td>
                </tr>
                <tr height="25">
                	<td><font>概要介绍：</font><font>${stone.shortDesc }</font></td>	
                </tr>
            </tbody>
        </table>
    </div>
</div>
<div class="clear" style="_width:960px;overflow:hidden;"></div>
<div class="grid-m div">
		<div class="content">
	        <div id="sale" class="wrap">
	            <div class="shop_tab">
	                <ul id="danpin1_nav">
	                    <li><a>相似品种</a></li>
	                    <li><a>热门推荐</a></li>
	                    <li><a>最近浏览</a></li>
	                </ul>
	            </div>
	            <div class="detail" id="danpin1_panel" style="height:165px;"> 
	                <ul class="shop_show" style="display:none">
	                	<c:forEach items="${likelyList}" var="stone">
	                    <li>
	                        <a href="stone/toStoneCompany.action?stoneId=${stone.id}" target="_blank"><img width="120" height="120" src="upload/stone/70/${stone.defaultPhoto}"/>
	                        <span class=""><strong class="keep">${stone.chineseName}</strong></span>
	                        </a>
	                    </li> 
	                    </c:forEach>
	                </ul>
	                <ul class="shop_show" id="commendList_4" style="display:none">
	                	<c:forEach items="${sessionScope.recommend}" var="recommend">
	                    <li>
	                        <a href="stone/toStoneCompany.action?stoneId=${recommend.stone.id}" target="_blank"><img width="120" height="120" src="upload/stone/70/${recommend.stone.defaultPhoto}"/>
	                        <span class=""><strong class="keep">${recommend.stone.chineseName}</strong></span>
	                        </a>
	                    </li> 
	                    </c:forEach>
	                </ul>
	                <ul class="shop_show" id="commendList_4" style="display:none">
	                    <c:forEach items="${sessionScope.recent}" var="stone">
	                    <li>
	                        <a href="stone/toStoneCompany.action?stoneId=${stone.id}" target="_blank"><img width="120" height="120" src="upload/stone/70/${stone.defaultPhoto}"/>
	                        <span class=""><strong class="keep">${stone.chineseName}</strong></span>
	                        </a>
	                    </li> 
	                    </c:forEach>
	                </ul>
	            </div>
	        </div>
	    </div>
	</div>
<div class="clear" style="_width:960px;overflow:hidden;"></div>
	<jsp:include page="pages/footer.jsp"></jsp:include>
<script type="text/javascript">
jWidget.ui.SlideView("slider", {effect: 'none',eventType:'click',autoPlayInterval:6000,slideTime:10000});
jWidget.ui.TabView("sale", {panelWrapper : 'danpin1_panel', navWrapper : 'danpin1_nav', navClassOn:'tab_on',eventType:'click'});
</script>
<script type="text/javascript" src="js/backToTop.js"></script>
</body>

</html>
